<template>
  <div class="app-container">
    <div>
      <el-tabs v-model="activeName"  style="width: 80%; margin: auto;" type="border-card">
        <!--收入-->
        <el-tab-pane  label="收入" name="first">
          <el-form ref="inForm" :rules="rulesI" label-position="left" :model="inForm" label-width="82px">
            <el-row>
              <el-col :xs="24" :sm="24" :md="10">
                <el-form-item prop="account" label="资金账户">
                  <el-select prop="account" v-model="inForm.account" placeholder="请选择">
                    <el-option-group v-for="group in accountOptions" :key="group.atype" :label="group.atype" >
                      <el-option style="font-size: 14px;" v-for="item in group.options" :key="item.aid" :label="item.aname" :value="item.aid">
                      </el-option>
                    </el-option-group>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :xs="24" :sm="24" :md="10">
                <el-form-item prop="transactionType" label="交易类型">
                  <el-select v-model="inForm.transactionType" placeholder="请选择">
                    <el-option value="同日收入">
                      同日收入
                    </el-option>
                    <el-option value="应收款">
                      应收款
                    </el-option>
                    <el-option value="非同日收入">
                      非同日收入
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>

            <el-row>
              <el-col :xs="24" :sm="24" :md="10">
                <el-form-item prop="currency" label="币种类型">
                  <el-select v-model="inForm.currency" placeholder="请选择">
                    <el-option v-for="item in currencyList" :key="item.cid" :label="item.cnName" :value="item.cid">
                      <span style="float: left">{{ item.cnName }}</span>
                      <span style="float: right; color: #8492a6; font-size: 13px">{{ item.enName }}</span>
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :xs="24" :sm="24" :md="10">
                <el-form-item prop="object" label="收入对象">
                  <el-select v-model="inForm.object" placeholder="请输入对象">
                    <el-option  v-for="itme in ObjList" :value="String(itme.objId)" :label="itme.objName" :key="String(itme.objId)" />
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>

            <el-row>
              <el-col :xs="24" :sm="24" :md="10">
                <el-form-item prop="incomeDate" label="收款日期">
                  <el-date-picker value-format="yyyy-MM-dd" v-model="inForm.incomeDate" type="date" placeholder="选择日期">
                  </el-date-picker>
                </el-form-item>
              </el-col>

              <el-col :xs="24" :sm="24" :md="10">
                <el-form-item prop="proofDate" label="凭证日期">
                  <el-date-picker value-format="yyyy-MM-dd" v-model="inForm.proofDate" type="date" placeholder="选择日期">
                  </el-date-picker>
                </el-form-item>
              </el-col>
            </el-row>

            <el-row>
              <el-col :xs="24" :sm="24" :md="10">
                <el-form-item prop="reasonId" label="收入原因">
                  <el-cascader v-model="inForm.reasonId" :options="reasonSrList" :props="{ emitPath:false,expandTrigger: 'hover',label:'rname',value:'rid',children:'paramst'}"
                               @change="inReasonChange()" :show-all-levels="false">
                    <template slot-scope="{ node, data }"  v-if="data.rtype=='收入'">
                      <span v-if="data.rtype=='收入'">{{ data.rname }}</span>
                    </template>
                  </el-cascader>
                </el-form-item>
              </el-col>
              <el-col :xs="24" :sm="24" :md="10">
                <el-form-item prop="tag" label="收入标签">
                  <el-select v-model="inForm.tag" multiple placeholder="（可选）对此收入的标签" style="width: 230px;">
                    <el-option v-for="itme in labelList" :value="itme.labelId" :label="itme.labelName" :key="itme.labelId"/>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>

            <el-row>
              <el-col :xs="24" :sm="24" :md="10">
                <el-form-item prop="money" label="收入金额">
                  <el-input v-model.number="inForm.money"  placeholder="收入金额" style="width: 170px;"></el-input>
                </el-form-item>
              </el-col>

              <el-col :xs="24" :sm="24" :md="10">
                <el-form-item label="收入手续费">
                  <el-switch
                    width="35"
                    style="width: 45px;"
                    v-model="switchIvalue"
                    @change="switchI()"
                    active-color="#13ce66">
                  </el-switch>
                  <el-input v-model="inForm.serviceCharge" placeholder="收入手续费"  v-bind:style="styleI"></el-input>
                </el-form-item>
              </el-col>
            </el-row>

            <el-row>
              <el-col :xs="24" :sm="24" :md="10">
                <el-form-item prop="comment" label="收入备注">
                  <el-input v-model="inForm.comment " placeholder="收入备注" style="width: 170px;"></el-input>
                </el-form-item>
              </el-col>

              <el-col :xs="24" :sm="24" :md="10">
                <div style="display: flex;flex-direction: row;">
                  <el-form-item prop="taxRateType" label="收入营业税">
                    <el-select style="width: 140px;" v-model="inForm.taxRateType" @change="switchTaxI(inForm.taxRateType)">
                      <el-option value="应税">应税</el-option>
                      <el-option value="免税" selected = "selected">免税</el-option>
                      <el-option value="零税率">零税率</el-option>
                    </el-select>
                    <el-input v-model="inForm.taxRate" placeholder="营业税"  v-bind:style="styleTaxI"></el-input>
                  </el-form-item>

                </div>

              </el-col>

            </el-row>

            <el-row>
              <el-col :xs="24" :sm="24" :md="10">
                <el-form-item prop="earnest" label="收入订金">
                  <el-input v-model="inForm.deposit" placeholder="收入金额" style="width: 170px;"></el-input>
                </el-form-item>
              </el-col>

              <el-col :xs="24" :sm="24" :md="10">
                <el-form-item prop="invoice" label="发票号码">
                  <el-input v-model="inForm.invoice" placeholder="发票号码" style="width: 170px;"></el-input>
                </el-form-item>
              </el-col>

            </el-row>

            <el-row>
              <el-col :xs="24" :sm="24" :md="12">
                <el-form-item prop="attachment" label="上传附件">
                  <fileUpload v-model="inForm.attachment"></fileUpload>
                </el-form-item>
              </el-col>
            </el-row>

            <el-row>
              <el-col :xs="24" :sm="24" :md="10">

              </el-col>
              <el-col :xs="24" :sm="24" :md="10" :offset="10">
                <el-button class="" type="success" @click="income()">录入</el-button>
                <el-button @click="restForm('inForm')">重置</el-button>
              </el-col>
            </el-row>
          </el-form>


        </el-tab-pane>

        <!--支出-->
        <el-tab-pane label="支出" name="second" >

          <el-form ref="outForm" :rules="rulesD" label-position="left" :model="outForm" label-width="82px">
            <el-row>
              <el-col :xs="24" :sm="24" :md="10">
                <el-form-item prop="account" label="资金账户">
                  <el-select prop="account" v-model="outForm.account" placeholder="请选择">
                    <el-option-group v-for="group in accountOptions" :key="group.atype" :label="group.atype">
                      <el-option v-for="item in group.options" :key="item.aid" :label="item.aname" :value="item.aid">
                      </el-option>
                    </el-option-group>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :xs="24" :sm="24" :md="10">
                <el-form-item prop="transactionType" label="交易类型">
                  <el-select v-model="outForm.transactionType" placeholder="请选择">
                    <el-option value="同日支出">
                      同日支出
                    </el-option>
                    <el-option value="应付款">
                      应付款
                    </el-option>
                    <el-option value="非同日支出">
                      非同日支出
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>

            <el-row>
              <el-col :xs="24" :sm="24" :md="10">
                <el-form-item prop="currency" label="币种类型">
                  <el-select v-model="outForm.currency" @input="rZ()" placeholder="请选择">
                    <el-option v-for="item in currencyList" :key="item.cid" :label="item.cnName" :value="item.cid">
                      <span style="float: left">{{ item.cnName }}</span>
                      <span style="float: right; color: #8492a6; font-size: 13px">{{ item.enName }}</span>
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :xs="24" :sm="24" :md="10">
                <el-form-item prop="object" label="支出对象">
                  <el-select v-model="outForm.object" placeholder="请输入对象">
                    <el-option  v-for="itme in ObjList" :value="String(itme.objId)" :label="itme.objName" :key="String(itme.objId)" />
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>

            <el-row>
              <el-col :xs="24" :sm="24" :md="10">
                <el-form-item prop="payDate" label="付款日期">
                  <el-date-picker value-format="yyyy-MM-dd" v-model="outForm.payDate" type="date" placeholder="选择日期">
                  </el-date-picker>
                </el-form-item>
              </el-col>

              <el-col :xs="24" :sm="24" :md="10">
                <el-form-item prop="proofDate" label="凭证日期">
                  <el-date-picker value-format="yyyy-MM-dd" v-model="outForm.proofDate" type="date" placeholder="选择日期">
                  </el-date-picker>
                </el-form-item>
              </el-col>
            </el-row>

            <el-row>
              <el-col :xs="24" :sm="24" :md="10">
                <el-form-item prop="reasonId" label="支出原因">
                  <el-cascader ref="reasonId" v-model="outForm.reasonId" @change="pe()" :options="reasonZcList" :props="{ emitPath:false,expandTrigger: 'hover',label:'rname',value:'rid',children:'paramst'}"
                               :show-all-levels="false">

                    <template slot-scope="{ node, data }">
                      <span v-if="data.rtype=='支出'">{{ data.rname }}</span>
                    </template>
                  </el-cascader>
                </el-form-item>
              </el-col>
              <el-col :xs="24" :sm="24" :md="10">
                <el-form-item prop="tag" label="支出标签">
                  <el-select v-model="outForm.tag" multiple placeholder="（可选）对此支出标签的标签" style="width: 230px;">
                    <el-option v-for="itme in labelList" :value="itme.labelId" :label="itme.labelName" :key="itme.labelId"/>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>

            <el-row>
              <el-col :xs="24" :sm="24" :md="10">
                <el-form-item prop="money" label="支出金额">
                  <el-input v-model="outForm.money" placeholder="支出金额" style="width: 170px;" @input="getbl()"></el-input>
                </el-form-item>
              </el-col>

              <el-col :xs="24" :sm="24" :md="10">
                <el-form-item label="支出手续费">
                  <el-switch
                    width="35"
                    style="width: 45px;"
                    v-model="switchDvalue"
                    @change="switchD()"
                    active-color="#13ce66">
                  </el-switch>
                  <el-input v-model="outForm.serviceCharge" placeholder="支出手续费"  v-bind:style="styleD"></el-input>
                </el-form-item>
              </el-col>
            </el-row>

            <el-row>
              <el-col :xs="24" :sm="24" :md="10">
                <el-form-item prop="comment" label="支出备注">
                  <el-input v-model="outForm.comment" placeholder="支出备注" style="width: 170px;"></el-input>
                </el-form-item>
              </el-col>

              <el-col :xs="24" :sm="24" :md="10">
                <div style="display: flex;flex-direction: row;">
                  <el-form-item prop="taxRateType" label="支出营业税">
                    <el-select style="width: 140px;" v-model="outForm.taxRateType" @change="switchTaxD(outForm.taxRateType)">
                      <el-option value="应税">应税</el-option>
                      <el-option value="零税率">零税率</el-option>
                      <el-option value="免税">免税</el-option>
                    </el-select>
                    <el-input v-model="outForm.taxRate" placeholder="营业税"  v-bind:style="styleTaxD"></el-input>
                  </el-form-item>
                </div>

              </el-col>
            </el-row>

            <!-- 		<el-row>
                  <el-col :xs="24" :sm="24" :md="10">
                    <el-form-item prop="deposit" label="订金">
                      <el-input v-model="inForm.deposit" placeholder="收入金额" style="width: 170px;"></el-input>
                    </el-form-item>
                  </el-col>

                </el-row> -->

            <el-row>
              <el-col :xs="24" :sm="24" :md="10">
                <el-form-item prop="invoice" label="发票号码">
                  <el-input v-model="outForm.invoice" placeholder="发票号码" style="width: 170px;"></el-input>
                </el-form-item>
              </el-col>
              <el-col :xs="24" :sm="24" :md="12">
                <el-form-item prop="attachment" label="上传附件">
                  <fileUpload v-model="outForm.attachment"></fileUpload>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :xs="24" :sm="24" :md="10">
                <!-- 购买设备 -->
                <template v-if="peOpen">
                  <el-form label-width="" >
                    <el-form-item label="财产名称">
                      <el-input v-model="outForm.deviceName" style="width: 300px;" placeholder="财产的名称"></el-input>
                    </el-form-item>
                    <el-form-item label="财产编号">
                      <el-input v-model="outForm.deviceCode" @input="numberTF1(outForm.deviceCode)" style="width: 300px;" placeholder="财产编号"></el-input>
                    </el-form-item>
                    <el-form-item label="财产总额">
                      <el-input v-model="outForm.deviceMoney" @input="numberTF2(outForm.deviceMoney)" style="width: 300px;" placeholder="财产总额"></el-input>
                    </el-form-item>
                    <el-form-item label="财产数量">
                      <el-input v-model="outForm.deviceCount" @input="numberTF3(outForm.deviceCount)" style="width: 300px;" placeholder="产品个数"></el-input>
                    </el-form-item>
                    <el-form-item label="耐用月数">
                      <el-select v-model="outForm.month"style="width: 300px;" placeholder="耐用月数">
                        <el-option value="0" label="0"/>
                        <el-option value="1" label="1"/>
                        <el-option value="2" label="2"/>
                        <el-option value="3" label="3"/>
                        <el-option value="4" label="4"/>
                        <el-option value="5" label="5"/>
                        <el-option value="6" label="6"/>
                        <el-option value="7" label="7"/>
                        <el-option value="8" label="8"/>
                        <el-option value="9" label="9"/>
                        <el-option value="10" label="10"/>
                        <el-option value="11" label="11"/>
                        <el-option value="12" label="12"/>
                      </el-select>
                    </el-form-item>
                    <el-form-item label="折旧开始日期">
                      <el-date-picker value-format="yyyy-MM-dd HH:mm:ss" v-model="outForm.startDate" type="date" placeholder="选择日期"/>
                    </el-form-item>
                  </el-form>
                </template>
              </el-col>
              <el-col :xs="24" :sm="24" :md="10" :offset="10">
                <el-button class="" type="success" @click="pay()">录入</el-button>
                <el-button @click="restForm('outForm')">重置</el-button>
              </el-col>
            </el-row>
          </el-form>


        </el-tab-pane>

        <!--移转-->
        <el-tab-pane label="移转" name="third">

          <el-form ref="transForm" :rules="rules" label-position="left" :model="transForm" label-width="82px">
            <el-row>
              <el-col :xs="24" :sm="24" :md="10">
                <el-form-item prop="outaccount" label="转出账户">
                  <el-select v-model="transForm.outaccount"  @change="rA()"  @input="cx()" placeholder="请选择">
                    <el-option-group v-for="group in accountOptions" :key="group.atype" :label="group.atype" >
                      <el-option style="font-size: 14px;" v-for="item in group.options" :key="item.aid" :label="item.aname" :value="item.aid">
                      </el-option>
                    </el-option-group>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :xs="24" :sm="24" :md="10">
                <el-form-item prop="inaccount" label="转入账户">
                  <el-select v-model="transForm.inaccount" placeholder="请选择">
                    <el-option-group v-for="group in accountOptions" :key="group.atype" :label="group.atype" >
                      <el-option style="font-size: 14px;" v-for="item in group.options" :key="item.aid" :label="item.aname" :value="item.aid">
                      </el-option>
                    </el-option-group>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>

            <el-row>
              <el-col :xs="24" :sm="24" :md="10">
                <el-form-item prop="outcurrency" label="转出币种">
                  <el-select v-model="transForm.outcurrency" @change="rC()" @input="cx()"  placeholder="请选择">
                    <el-option  v-for="item in currencyList" :key="item.cid" :label="item.cnName" :value="item.cid">
                      <span style="float: left">{{ item.cnName }}</span>
                      <span style="float: right; color: #8492a6; font-size: 13px">{{ item.enName }}</span>
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>

              <el-col :xs="24" :sm="24" :md="10">
                <el-form-item prop="incurrency" label="转入币种">
                  <el-select v-model="transForm.incurrency" @input="cx()" placeholder="请选择">
                    <el-option  v-for="item in currencyList" :key="item.cid" :label="item.cnName" :value="item.cid">
                      <span style="float: left">{{ item.cnName }}</span>
                      <span style="float: right; color: #8492a6; font-size: 13px">{{ item.enName }}</span>
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>

            </el-row>

            <el-row>
              <el-col :xs="24" :sm="24" :md="10">
                <el-form-item prop="transferMoney" label="移转金额">
                  <el-input v-model="transForm.transferMoney" @input="rM()" placeholder="转移金额" style="width: 170px;"></el-input>
                </el-form-item>
              </el-col>
              <el-col :xs="24" :sm="24" :md="10">
                <el-form-item prop="transferDate" label="转移日期">
                  <el-date-picker v-model="transForm.transferDate" type="date" placeholder="选择日期">
                  </el-date-picker>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :xs="24" :sm="24" :md="10">
                <el-form-item label="转出手续费">
                  <el-switch
                    width="35"
                    style="width: 45px;"
                    v-model="switchTCvalue"
                    @change="switchTC()"
                    active-color="#13ce66">
                  </el-switch>
                  <el-input v-model="transForm.outaccountServiceCharge" placeholder="转出手续费"  v-bind:style="styleTC"></el-input>
                </el-form-item>
              </el-col>
              <el-col :xs="24" :sm="24" :md="10">
                <el-form-item label="转入手续费">
                  <el-switch
                    width="35"
                    style="width: 45px;"
                    v-model="switchTRvalue"
                    @change="switchTR()"
                    active-color="#13ce66">
                  </el-switch>
                  <el-input v-model="transForm.inaccountServiceCharge" placeholder="转入手续费"  v-bind:style="styleTR"></el-input>
                </el-form-item>
              </el-col>

            </el-row>
            <el-row>
              <el-col :xs="24" :sm="24" :md="10">
                <el-form-item prop="" label="附注说明">
                  <el-input v-model="transForm.explain" placeholder="附注说明 " style="width: 170px;">
                  </el-input>
                </el-form-item>
              </el-col>
              <el-col :xs="24" :sm="24" :md="10">
                <el-form-item prop="" label="到账时间">
                  <el-input v-model="transForm.days" placeholder="到账时间" @input="numberTFDays(transForm.days)" style="width: 170px;">
                  </el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :xs="24" :sm="24" :md="12">
                <el-form-item prop="attachment" label="上传附件">
                  <fileUpload v-model="transForm.attachment"></fileUpload>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-form-item prop="">
                <el-button class="" type="success" @click="transfer()">录入</el-button>
                <el-button @click="restForm('transForm')">重置</el-button>
              </el-form-item>
            </el-row>
          </el-form>
        </el-tab-pane>
      </el-tabs>
    </div>
    <div>
      <div class="app-container" style="width: 90%; margin: auto; padding-top: 50px;">
        <el-row>

          <hr style="height: 3px; border-radius: 10px; background-color: #4492f3;border: 0px">
          <p>最近收入</p>

        </el-row>
        <el-table :data="transactionDetailList" border>
          <el-table-column label="" align="center" prop="dtype">
            <template slot-scope="scope">
              <el-button size="mini" type="primary" v-if="scope.row.dtype=='收入'">收入</el-button>
              <el-button size="mini" type="success" v-if="scope.row.dtype=='支出'">支出</el-button>
              <el-button size="mini" type="info" v-if="scope.row.dtype=='转移'">转移</el-button>
              <el-button size="mini" type="primary" v-if="scope.row.dtype=='应收款'">应收款</el-button>
              <el-button size="mini" type="primary" v-if="scope.row.dtype=='应付款'">应付款</el-button>
            </template>
          </el-table-column>
          <el-table-column label="交易时间" align="center" prop="transactionDate">
            <template slot-scope="scope">
              <span>{{ parseTime(scope.row.transactionDate, '{y}-{m}-{d}') }}</span>
            </template>
          </el-table-column>
          <el-table-column label="资金账户" align="center" prop="ofAccount">
            <template slot-scope="scope">
              <div v-for="itme in accountList" >
                        <span v-if="itme.aid==scope.row.ofAccount">
                          {{itme.aname}}
                        </span>
              </div>
            </template>
          </el-table-column>
          <el-table-column label="交易原因" align="center" prop="ofReason">
            <template slot-scope="scope">
              <div v-for="itme in reasonList" >
                <span v-if="scope.row.ofReason==itme.rid">{{itme.rname}}</span>

              </div>
              <span v-if="scope.row.dtype=='转移'">移转</span>
            </template>
          </el-table-column>

          <el-table-column label="交易金额" align="center" prop="money" />
          <el-table-column label="对象" align="center" prop="object">
            <template slot-scope="scope" >
              <span  v-for="itme in ObjList" v-if="parseInt(scope.row.object)==itme.objId">{{itme.objName}}</span>
            </template>
          </el-table-column>
        </el-table>
        <hr style="height: 3px; border-radius: 10px; background-color: #4492f3;border: 0px">
      </div>
      <el-dialog title="查看收入详细" :visible.sync="incomeOpen" width="1500px" show-close>
        <el-table :data="checkIncome">
          <el-table-column label="收入账户" align="center" prop="ofAccount">
            <template slot-scope="scope">
              <div v-for="itme in accountList" >
                        <span v-if="itme.aid==scope.row.ofAccount">
                          {{itme.aname}}
                        </span>
              </div>
            </template>
          </el-table-column>
          <el-table-column label="币种" align="center" prop="ofCurrency">
            <template slot-scope="scope">
              <div v-for="itme in currencyList" >
                        <span v-if="itme.cid==scope.row.ofCurrency">
                          {{itme.cnName}}({{itme.enName}})
                        </span>
              </div>
            </template>
          </el-table-column>
          <el-table-column label="交易类型" align="center" prop="dealType" />
          <el-table-column label="收款日期" align="center" prop="incomeDate">
            <template slot-scope="scope">
              <span>{{ parseTime(scope.row.incomeDate, '{y}-{m}-{d}') }}</span>
            </template>
          </el-table-column>
          <el-table-column label="凭证日期" align="center" prop="proofDete">
            <template slot-scope="scope">
              <span>{{ parseTime(scope.row.proofDete, '{y}-{m}-{d}') }}</span>
            </template>
          </el-table-column>
          <el-table-column label="收入原因" align="center" prop="ofReason" />
          <el-table-column label="对象" align="center" prop="object" />
          <el-table-column label="收入金额" align="center" prop="incomeMoney" />
          <el-table-column label="手续费" align="center" prop="serviceCharge" />
          <el-table-column label="营业税" align="center" prop="dbTax" />
          <el-table-column label="定金" align="center" prop="earnest" />
          <el-table-column label="附件" align="center" prop="fileUrl" />
          <el-table-column label="备注" align="center" prop="remark" />
          <el-table-column label="查看账户余额" align="center" prop="remark">
            <template slot-scope="scope">
              <el-button size="mini" type="primary" @click="BalanceIncome(scope.row)">查看账户余额</el-button>
            </template>
          </el-table-column>
        </el-table>
      </el-dialog>
      <!-- 余额列表 -->
      <el-dialog title="资金账户余额" :visible.sync="showBalanceIncome" width="400px">
        <el-table :data="balanceList" max-height="600px">
          <el-table-column property="balance" label="账户余额" width="150" align="center"></el-table-column>
          <el-table-column property="ofCurrency" label="币种类型" align="center">
            <template slot-scope="scope">
              <div v-for="itme in currencyList">
                <span v-if="itme.cid==scope.row.ofCurrency">{{itme.cnName}}({{itme.enName}})</span>
              </div>
            </template>
          </el-table-column>
        </el-table>
      </el-dialog>
    </div>
  </div>
</template>
<script>
  import {listAccount,income} from '@/api/system/account'
  import {listCurrency} from '@/api/system/currency';
  import {listBalance,addBalance,updateBalance,getBalance} from '@/api/system/balance';
  import {listReason,listRC} from '@/api/system/reason';
  import {addIncome,listIncome,addIncomeS} from '@/api/system/income';
  import {addDisbures,listDisbures,addDisburesS} from '@/api/system/disbures';
  import {addTransfer,listTransfer,addTransferS} from '@/api/system/transfer';
  import {listAccountDetail,addAccountDetail} from '@/api/system/accountDetail';
  import {ListTransactionDetail,} from '@/api/system/transactionDetail';
  import { getInfo } from "@/api/login";
  import { listObj } from "@/api/system/obj";
  import { listLabel } from "@/api/system/label";

  export default {
    data() {
      return {
        ObjList:[],
        freshDom:null,
        peOpen:false,
        showBalanceIncome:false,
        showBalanceDisbures:false,
        showBalanceTransfer:false,
        incomeOpen:false,
        disburseOpen:false,
        transferOpen:false,
        checkIncome:[],
        checkDisbures:[],
        checkTransfer:[],
        incomeList:[],
        disburesList:[],
        transferList:[],
        switchDvalue:false,
        switchTRvalue:false,
        switchIvalue:false,
        switchTCvalue:false,
        switchITaxValue:false,
        switchDTaxValue:false,
        styleS:'width:170px;display: none;',
        styleTC:'width:170px;display: none;',
        styleTR:'width:170px;display: none;',
        styleD:'width:170px;display: none;',
        styleI:'width:170px;display: none;',
        styleTaxI:'width:100px;display: none;',
        styleTaxD:'width:100px;display: none;',
        setting: "", //设置
        accountOptions1: '',
        activeName: 'first',
        tabIndex: 1,
        balanceList:[],
        currencyList: null, //币种列表
        reasonList:null,
        reasonSrList: null, //原因列表
        reasonZcList: null, //原因列表
        transactionDetailList:[],
        accountList:null,
        inForm: {taxRateType:'免税'},
        outForm: { taxRateType:'免税'},
        transForm: {},
        accountOptions: [],
        labelList:[],
        // 表单校验
        rules: {
          outaccount: [
            { required: true, message: "转出账户不能为空", trigger: "blur" }
          ],
          inaccount: [
            { required: true, message: "转入账户不能为空", trigger: "blur" }
          ],
          outcurrency: [
            { required: true, message: "转出币种不能为空", trigger: "blur" }
          ],
          incurrency: [
            { required: true, message: "转入币种不能为空", trigger: "blur" }
          ],
          transferMoney: [
            { required: true, message: "转移金额不能为空", trigger: "blur" }
          ],
          transferDate:[
            { required: true, message: "转移时间不能为空", trigger: "blur" }
          ]
        },
        rulesI: {
          account: [
            { required: true, message: "收入账户不能为空", trigger: "blur" }
          ],
          currency: [
            { required: true, message: "币种不能为空", trigger: "blur" }
          ],
          transactionType: [
            { required: true, message: "交易类型不能为空", trigger: "change" }
          ],
          incomeDate: [
            { required: true, message: "收款日期不能为空", trigger: "blur" }
          ],
          proofDate: [
            { required: true, message: "凭证日期不能为空", trigger: "blur" }
          ],
          reasonId: [
            { required: true, message: "收入原因不能为空", trigger: "blur" }
          ],
          object: [
            { required: true, message: "对象不能为空", trigger: "blur" }
          ],
          money: [
            { required: true, message: "收入金额不能为空", trigger: "blur" },
            { type: 'number', message: '必须是数字'}
          ],

        },
        rulesD: {
          account: [
            { required: true, message: "支出账户不能为空", trigger: "blur" }
          ],
          currency: [
            { required: true, message: "币种不能为空", trigger: "blur" }
          ],
          transactionType: [
            { required: true, message: "交易类型不能为空", trigger: "change" }
          ],
          payDate: [
            { required: true, message: "支出日期不能为空", trigger: "blur" }
          ],
          proofDate: [
            { required: true, message: "凭证日期不能为空", trigger: "blur" }
          ],
          reasonId: [
            { required: true, message: "支出原因不能为空", trigger: "blur" }
          ],
          object: [
            { required: true, message: "对象不能为空", trigger: "blur" }
          ],
          money: [
            { required: true, message: "支出金额不能为空", trigger: "blur" }
          ],
        },
      };
    },
    created() {
      this.getHome()
      this.transForm.days=2
    },
    methods: {
      fresh(){
        //每次赋freshDom 不同的值，达到刷新目的
        this.freshDom = + new Date();
      },
      inReasonChange(val) {
        console.log(val);
      },
      income() {
        this.$refs["inForm"].validate(valid => {
          if (valid) {
            this.$confirm('请确认填写内容, 是否继续?', '提示', {
              confirmButtonText: '确定',
              cancelButtonText: '取消',
              type: 'warning'
            }).then(() => {
              getInfo().then(data=>{
                this.inForm.ofCompany=data.tuser.ofCompany;
                if(this.inForm.tag!=null || this.inForm.tag!=''){
                  this.inForm.tag=String(this.inForm.tag.toString());
                }
                console.log(JSON.stringify(this.inForm))
                addIncomeS(this.inForm).then(res => {
                  this.freshDom=new Date();
                  if(res.code==200){
                    this.$message({
                      type: 'success',
                      message: '提交成功!'
                    });
                    this.restForm('inForm')
                    this.$nextTick(() => {
                      this.inForm.serviceCharge=undefined;
                      this.switchIvalue=false;
                      this.styleI='width:100px;display: none;';
                      this.styleTaxI = 'width:100px;display: none;';
                      this.inForm.taxRate=undefined;
                    });
                    this.getHome();
                    this.$forceUpdate();
                  }
                })
              })
            }).catch(() => {
              this.$message({
                type: 'info',
                message: '取消提交'
              });
            });
          }
        })

      },

      pay() {
        this.$refs["outForm"].validate(valid => {
          if (valid) {
            this.$confirm('请确认填写内容, 是否继续?', '提示', {
              confirmButtonText: '确定',
              cancelButtonText: '取消',
              type: 'warning'
            }).then(() => {
              getInfo().then(data=> {
                if(this.outForm.tag!=null || this.outForm.tag!=''){
                  this.outForm.tag=String(this.outForm.tag.toString());
                }
                this.outForm.ofCompany = data.tuser.ofCompany;
                addDisburesS(this.outForm).then(date => {
                  if (date.code == 200) {
                    this.$message({
                      type: 'success',
                      message: '提交成功!'
                    });
                    this.restForm("outForm")
                    this.$nextTick(() => {
                      this.outForm.deviceName='';
                      this.outForm.deviceCode='';
                      this.outForm.deviceMoney='';
                      this.outForm.deviceCount='';
                      this.outForm.month='';
                      this.outForm.startDate='';
                      this.switchDvalue=false;
                      this.outForm.taxRate='';
                      this.styleD='width:100px;display: none;';
                      this.styleTaxD = 'width:100px;display: none;';
                      this.peOpen=false;
                    });
                    this.getHome();

                  }
                })
              })
            }).catch(() => {
              this.$message({
                type: 'info',
                message: '取消提交'
              });
            });
          }
        })
      },
      transfer() {
        this.$refs["transForm"].validate(valid => {
          if (valid) {
            this.$confirm('请确认填写内容, 是否继续?', '提示', {
              confirmButtonText: '确定',
              cancelButtonText: '取消',
              type: 'warning'
            }).then(() => {
              getInfo().then(data=> {
                this.transForm.ofCompany = data.tuser.ofCompany;

                addTransferS(this.transForm).then(date => {
                  if (date.code == 200) {
                    this.$message({
                      type: 'success',
                      message: '提交成功!'
                    });
                    this.restForm('transForm')
                    this.$nextTick(() => {
                      this.switchTCvalue=false;
                      this.switchTRvalue=false;
                      this.styleTC = 'width:100px;display: none;';
                      this.styleTR = 'width:100px;display: none;';
                      this.transForm.outaccountServiceCharge='';
                      this.transForm.inaccountServiceCharge='';
                      this.transForm.explain='';
                      this.transForm.a='';
                    });
                    this.getHome();
                  }
                })
              })
            }).catch(() => {
              this.$message({
                type: 'info',
                message: '取消提交'
              });
            });
          }
        })
      },
      getHome() {
        let that = this
        this.accountOptions = [{
          atype: '现金',
          options: []
        }, {
          atype: '银行卡',
          options: []
        }, {
          atype: '信用卡',
          options: []
        }]
        getInfo().then(data=>{
          let account = {};
          account.atype = "现金";
          account.stop = 0;
          account.ofCompany=data.tuser.ofCompany;
          listAccount(account).then(date => {
            this.accountOptions[0].options = date.rows;
          })
          account.atype = "银行存款";
          account.stop = 0;
          listAccount(account).then(date => {
            this.accountOptions[1].options = date.rows;
          })
          account.atype = "信用卡";
          account.stop = 0;
          listAccount(account).then(date => {
            this.accountOptions[2].options = date.rows;
          })
          listAccount({ofCompany:data.tuser.ofCompany}).then(date => {
            this.accountList = date.rows;
          })

          listCurrency().then(date => {
            this.currencyList = date.rows;
          })
          listRC({ofCompany:data.tuser.ofCompany,ofCompanyType:0,parent: "-1", rtype: "收入"}).then(date => {
            this.reasonSrList = date.rows;
          })
          listRC({ofCompany:data.tuser.ofCompany,ofCompanyType:0,parent: "-1", rtype: "支出"}).then(date => {
            this.reasonZcList = date.rows;
          })
          listRC({ofCompany:data.tuser.ofCompany,ofCompanyType:0}).then(date => {
            this.reasonList = date.rows;
          })

          let obj={};
          obj.objCompany=data.tuser.ofCompany;
          listObj(obj).then(rep=>{
            this.ObjList=rep.rows;
          })

          let label={}
          label.labelCompeny=data.tuser.ofCompany;
          listLabel(label).then(rep=>{
            this.labelList=rep.rows;
          })

          let detail = {};
          detail.deleted = 0;
          detail.pageNum = 0;
          detail.pageSize = 7;
          detail.ofCompany=data.tuser.ofCompany;
          ListTransactionDetail(detail).then(data => {
            this.transactionDetailList = data.rows;
          })
        })
      },
      tabChange(tab) {
        this.tabIndex = tab
      },
      // 递归判断列表，把最后的children设为undefined
      getTreeData(data) {
        for (var i = 0; i < data.length; i++) {
          if (data[i].subreasonList.length < 1) {
            // children若为空数组，则将children设为undefined
            data[i].subreasonList = undefined;
          } else {
            // children若不为空数组，则继续 递归调用 本方法
            this.getTreeData(data[i].subreasonList);
          }
        }
        return data;
      },
      handleRemove(file, fileList) {
        //删除文件
      },
      handleExceed(files, fileList) {
        this.$message.warning(`当前限制选择 1 个文件，本次选择了 ${files.length} 个文件，共选择了 ${files.length + fileList.length} 个文件`);
      },
      beforeRemove(file, fileList) {
        return this.$confirm(`确定移除 ${ file.name }？`);
      },
      restForm(formName){
        console.log("ssa");
        this.$refs[formName].resetFields();
      },
      handleFilterChange(row,col){
        console.log(row,col);
      },
      switchS(){
        if(this.switchValue==true){
          this.styleS="width:170px;";
        }else{
          this.styleS='width:170px;display: none;';
        }
      },
      switchD(){
        if(this.switchDvalue==true){
          this.styleD="width:170px;";
        }else{
          this.styleD='width:170px;display: none;';
          this.outForm.taxRate=null;
        }

      },
      switchI(){
        if(this.switchIvalue==true){
          this.styleI="width:170px;";
        }else{
          this.styleI='width:170px;display: none;';
        }
      },
      switchTR(){
        if(this.switchTRvalue==true){
          this.styleTR="width:170px;";
        }else{
          this.styleTR='width:170px;display: none;';
        }
      },
      switchTC(){
        if(this.switchTCvalue==true){
          this.styleTC="width:170px;";
        }else{
          this.styleTC='width:170px;display: none;';
        }
      },
      switchTaxI(name){
        if(name=='应税'){
          this.styleTaxI="width:170px;";
        }else{
          this.styleTaxI='width:170px;display: none;';
          this.inForm.taxRate='';
        }
      },
      switchTaxD(name){
        if(name=='应税'){
          this.styleTaxD="width:170px;";
        }else{
          this.styleTaxD='width:170px;display: none;';
          this.outForm.taxRate='';
        }
      },
      rR(){
        listCurrency().then(date=>{
          this.currencyList=date.rows;
        })
        let balance = {};
        balance.ofAccount = this.transForm.inaccount;
        balance.ofCurrency = this.transForm.incurrency;
        listBalance(balance).then(data => {
          if (data.rows == "" || data.rows == null) {
            this.$message({
              type: 'warning',
              message:'资金账户不存在'
            });
            this.transForm.incurrency='';
          }
        })
      },
      rZ(){
        listCurrency().then(date=>{
          this.currencyList=date.rows;
        })
        let balance = {};
        balance.ofAccount = this.outForm.account;
        balance.ofCurrency = this.outForm.currency;
        listBalance(balance).then(data => {
          if (data.rows == "" || data.rows == null) {
            this.$message({
              type: 'warning',
              message:'资金账户不存在！'
            });
            this.outForm.currency='';
          }
        })
      },
      rC(){
        listCurrency().then(date=>{
          this.currencyList=date.rows;
        })
        let balance = {};
        balance.ofAccount = this.transForm.outaccount;
        balance.ofCurrency = this.transForm.outcurrency;
        listBalance(balance).then(data => {
          if (data.rows == "" || data.rows == null) {
            this.$message({
              type: 'warning',
              message:'转出账户币种余额为:0!'
            });
            this.transForm.outcurrency='';
          }
        })
      },
      rA(){

        if(this.transForm.outcurrency!='' && this.transForm.outcurrency!=null){
          this.rC();
        }
      },
      checkIncomeS(row){
        this.incomeOpen=true;
        let income={}
        income.incomeId=row.incomeId;
        listIncome(income).then(data=>{
          this.checkIncome=data.rows;
        })
      },
      checkDisburseS(row){
        this.disburseOpen=true;
        let disburse={}
        disburse.disburseId=row.disburseId;
        listDisbures(disburse).then(data=>{
          this.checkDisbures=data.rows;
        })
      },
      checkTransferS(row){
        this.transferOpen=true;
        let transfer={}
        transfer.transferId=row.transferId;
        listTransfer(transfer).then(data=>{
          this.checkTransfer=data.rows;
        })
      },
      BalanceIncome(row){
        this.showBalanceIncome=true;
        let balance={}
        balance.ofAccount=row.ofAccount;
        listBalance(balance).then(data=>{
          this.balanceList=data.rows;
        })
      },
      BalanceDisbures(row){
        this.showBalanceDisbures=true;
        let balance={}
        balance.ofAccount=row.ofAccount;
        listBalance(balance).then(data=>{
          this.balanceList=data.rows;
        })
      },
      BalanceTransferRoll(row){
        this.showBalanceTransfer=true;
        let balance={}
        balance.ofAccount=row.rolloutAccount;
        listBalance(balance).then(data=>{
          this.balanceList=data.rows;
        })
      },
      BalanceTransferShif(row){
        this.showBalanceTransfer=true;
        let balance={}
        balance.ofAccount=row.shifttoAccount;
        listBalance(balance).then(data=>{
          this.balanceList=data.rows;
        })
      },
      pe(){
        for(let itme in this.reasonZcList){
          if(this.reasonZcList[itme].rname=='购买'){
            let str=JSON.stringify(this.reasonZcList[itme].paramst).toString();
            if(str.includes( this.$refs["reasonId"].getCheckedNodes()[0].label)){
              this.peOpen=true;
            }else {
              this.peOpen=false;
            }
          }
        }
      },peQx(){
        this.outForm.deviceName=null;
        this.outForm.deviceCode=null;
        this.outForm.deviceMoney=null;
        this.outForm.deviceCount=null;
        this.outForm.month=null;
        this.outForm.startDate=null;
        this.peOpen=false;
      },
      numberTF3(row){
        let numReg = /^[0-9]*$/
        let numRe = new RegExp(numReg)
        if(!numRe.test(row)){
          this.outForm.deviceCount="";
        }
      },
      numberTF2(row){
        let numReg = /^[0-9]*$/
        let numRe = new RegExp(numReg)
        if(!numRe.test(row)){
          this.outForm.deviceMoney="";
        }
      },
      numberTF1(row){
        let numReg = /^[0-9]*$/
        let numRe = new RegExp(numReg)
        if(!numRe.test(row)){
          this.outForm.deviceCode="";
        }
      },
      numberTFDays(row){
        let numReg = /^[0-9]*$/
        let numRe = new RegExp(numReg)
        if(!numRe.test(row)){
          this.transForm.days="";
        }
      },
      getbl(){
        if(this.outForm.account!=null && this.outForm.currency!=null){
          let balance = {};
          balance.ofAccount = this.outForm.account;
          balance.ofCurrency = this.outForm.currency;
          listBalance(balance).then(data => {
            if (data.rows == "" || data.rows == null) {
              this.$message({
                type: 'warning',
                message:'账户币种余额为:0!'
              });
              this.outForm.money='';
            }else {
              for(let i in data.rows){
                if(this.outForm.money>data.rows[i].balance){
                  this.$message({
                    type: 'warning',
                    message:'账户币种余额不足，余额为：'+data.rows[i].balance+'!'
                  });
                  this.outForm.money='';
                }
              }
            }
          })
        }
      },
      rM(){
        if(this.transForm.outaccount!=null && this.transForm.outcurrency!=null){
          let balance = {};
          balance.ofAccount = this.transForm.outaccount;
          balance.ofCurrency = this.transForm.outcurrency;
          listBalance(balance).then(data => {
            if (data.rows == "" || data.rows == null) {
              this.$message({
                type: 'warning',
                message:'账户币种余额为:0!'
              });
              this.transForm.transferMoney='';
            }else {
              for(let i in data.rows){
                if(this.transForm.transferMoney>data.rows[i].balance){
                  this.$message({
                    type: 'warning',
                    message:'账户币种余额不足，余额为：'+data.rows[i].balance+'!'
                  });
                  this.transForm.transferMoney='';
                }
              }
            }
          })
        }
      },
      cx(){
        if(this.transForm.outaccount!=undefined || this.transForm.inaccount!=undefined){
          if(this.transForm.outaccount==this.transForm.inaccount || this.transForm.inaccount==this.transForm.outaccount){
            if(this.transForm.outcurrency!=undefined || this.transForm.incurrency!=undefined){
              if(this.transForm.outcurrency==this.transForm.incurrency || this.transForm.incurrency==this.transForm.outcurrency){
                this.$message.warning("相同资金账户币种不能相同")
                this.transForm.incurrency=''
              }
            }
          }
        }
      }
    }
  };
</script>
<style lang="scss" scoped>
  .aco_bbox {
    padding: 0 20px;
    width: 100%;
    min-height: calc(100vh - 104px);
    background-color: #fff;

    .aco_bbox_t {
      width: 100%;
      background-color: #fff;

      .tab_p_c {
        width: 100vh;
        height: 100vh;
      }

      .tab_btn_box {
        display: flex;
        flex-direction: row;
        font-size: 16px;

        .tab_btn {
          position: relative;
          font-weight: 400;
          padding: 6px 12px;
          color: #fff;
          background-color: #337AB7;
          border-color: #204d74;

          &::after {
            content: "";
            position: absolute;
            width: 1px;
            height: 100%;
            right: 0;
            top: 0;
            background-color: #2e6da4;
          }

          &:hover {
            cursor: pointer;
            background-color: #286090;
            border-color: #286090;
          }
        }

        .active {
          background-color: #286090;
          border-color: #286090;
        }
      }

    }
  }

  .c_box {
    margin-top: 20px;
    padding: 0 4px;
  }
</style>
